/**
* Description: 内容显示组件
*
* Created by hrx on 2023/5/24
*/
<template>
  <div>
    <el-tooltip v-if="text && text.length > maxLength" class="item" effect="dark" :content="text" placement="top">
      <span class="text" :style="{'-webkit-line-clamp': showLineNum}">{{ text }}</span>
    </el-tooltip>
    <span v-else>{{ text }}</span>
  </div>
</template>

<script>
export default {
  name: "ToolTip",
  props: {
    text: {
      type: String,
      default: ''
    },
    maxLength: {
      type: Number || String,
      default: 46
    },
    showLineNum: {
      type: Number || String,
      default: 2
    }
  }
};
</script>

<style scoped>
.text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  word-break: break-all;
}
</style>